<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>promise</title>
</head>
<body>
  <p>痛点1：回调地狱，可读性差，不方便维护</p>
  <p>痛点2：回调函数在JS引擎中会开辟新的执行栈去执行，外层tryCatch无法捕获内层回调中发生的异常</p>
  <p>使用ES6的Promise解决，可以将无限异步操作改写为同步执行流程，可以捕获内层回调中发生的异常</p>
  <p>promise中有3中状态，pending未执行，fulfilled已成功，rejected已失败</p>
  <p>pending->fulfilled pending->rejected，状态不可逆</p>
  <p>promise构造函数接收一个function，其中有两个参数resolve，reject，分别代表执行成功和失败的回调</p>
  <p>promise实例生成后会立刻执行，可以使用.then方法，指定resolve，reject的回调</p>
</body>
<script>
  function timeout(ms) {
    return new Promise(function (resolve, reject) {
      setTimeout(resolve, ms, 'hello promise');
    });
  }

  timeout(1000).then(function (value) {
    console.log(value);
  });

  const p1 = new Promise((resolve, reject) => {
    setTimeout(() => {reject(new Error('fail'))}, 3000);
  });

  const p2 = new Promise((resolve, reject) => {
    setTimeout(() => {resolve(p1)}, 1000);
  });

  p2.then(result => console.log(result)).catch(err => console.log(err));
</script>
</html>